<template>
  <div>
    <button @click="demo2">二</button>
    <button @click="demo3">三</button>
    <button @click="demo4">四</button>
  </div>
</template>

<script>
export default {
  name: 'WorkView',
  data: function () {
    return {
      arr: [1, 2, 3, 4],
      brr: [],
      crr: [
        {
          id: 1,
          name: 'zhangsan'
        },
        {
          id: 2,
          name: 'lisi'
        },
        {
          id: 3,
          name: 'wangwu'
        },
        {
          id: 4,
          name: 'zhaoliu'
        }
      ]
    }
  },
  methods: {
    demo2: function () {
      for (const a of this.arr) {
        this.brr.push(a * a)
      }
      this.brr.forEach((z, i) => {
        console.log('新数组的下标:' + i)
        console.log('新数组的值:' + z)
      })
      console.log(this.brr)
    },
    demo3: function () {
      this.arr.forEach(function (v, i) {
        console.log(i)
        console.log(v)
      })
    },
    demo4 () {
      for (let i = 0; i < this.crr.length; i++) {
        if (this.crr[i].id === 2) {
          console.log('id等于2的元素:' + this.crr[i].name)
          console.log('id等于2的元素的下标:' + i)
        }
      }
    }
  },
  mounted () {
  },
  computed: {
    getTest () {
      return ''
    }
  }
}
</script>

<style scoped>

</style>
